// import React, { useEffect, useRef, useState } from 'react';
// import { RingProgress } from '@antv/g2plot';
// import service from '../utils/request'; // 请根据实际情况调整路径
// import base_token from '../utils/base_constant'; // 请根据实际情况调整路径
//
// const workorder = () => {
//     // 使用useState管理状态
//     const [processingCount, setProcessingCount] = useState(0);
//     const [allCount, setAllCount] = useState(0);
//
//     // 使用useRef获取DOM引用
//     const workOrderRef = useRef(null);
//
//     // 初始化数据和图表
//     useEffect(() => {
//         const initData = async () => {
//             let url = '/workorder/pageQuery';
//             let res = await service.get(url, {
//                 params: {
//                     page: 1,
//                     pageSize: 10000
//                 },
//                 headers: {
//                     Authorization: base_token
//                 }
//             });
//
//             let data = res.data.list;
//             setAllCount(res.data.total);
//
//             let processingCount = data.filter(item => item.status === '进行中').length;
//             setProcessingCount(processingCount);
//
//             // 初始化图表
//             initCharts(processingCount, res.data.total);
//         };
//
//         // 初始化图表的函数
//         const initCharts = (processingCount, allCount) => {
//             const ringProgress = new RingProgress(workOrderRef.current, {
//                 height: 150,
//                 width: 150,
//                 autoFit: true,
//                 percent: processingCount / allCount,
//                 color: ['#00B16B', '#E8EDF3'],
//                 innerRadius: 0.85,
//                 radius: 0.98,
//                 statistic: {
//                     title: {
//                         style: { color: '#ffffff', fontSize: '15px', lineHeight: '14px' },
//                         formatter: () => '工单已完成进度',
//                     },
//                 },
//             });
//             ringProgress.render();
//         };
//
//         initData();
//     }, []);
//
//     return (
//         <div ref={workOrderRef}></div>
//     );
// };
//
// export default workorder;
